<%@page contentType="text/html; charset=iso-8859-1" session="true"
	language="java" import="java.util.*"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>TCS</title>
<meta name="author" content="Fernanda Barbero" />


<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<!--styles -->
<link href="css/bootstrap/bootstrap.css" rel="stylesheet" />
<link href="css/bootstrap/bootstrap-responsive.css" rel="stylesheet" />
<link href="css/supr-theme/jquery.ui.supr.css" rel="stylesheet"
	type="text/css" />
<link href="css/icons.css" rel="stylesheet" type="text/css" />
<link href="plugins/uniform/uniform.default.css" type="text/css"
	rel="stylesheet" />

<!-- Main stylesheets -->
<link href="css/main.css" rel="stylesheet" type="text/css" />

<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
<!--[if lt IE 9]>
        <link type="text/css" href="css/ie.css" rel="stylesheet" />
    <![endif]-->



<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

</head>

<body class="loginPage">


	<div class="container-fluid">
		<div class="loginContainer">
			<form class="form-horizontal" action="login.html" id="loginForm"
				method="post">

				<div class="form-row row-fluid">
					<div class="span12">
						<div class="row-fluid">
							<label class="form-label span12" for="username"> Email: <span
								class="icon16 icomoon-icon-user-2 right gray marginR10"></span>
							</label> <input class="span12" id="username" type="text" name="username"
								value="fernabel@gmail.com" />
						</div>
					</div>
				</div>

				<div class="form-row row-fluid">
					<div class="span12">
						<div class="row-fluid">
							<label class="form-label span12" for="password">
								Password: <span
								class="icon16 icomoon-icon-locked right gray marginR10"></span>

							</label> <input class="span12" id="password" type="password"
								name="password" value="fer123" />
						</div>
					</div>
				</div>
				<div class="form-row row-fluid">
					<div class="span12">
						<div class="row-fluid">
							<div class="form-actions">
								<div class="span12 controls">

									<button type="submit" class="btn btn-info right" id="loginBtn">
										<span class="icon16 icomoon-icon-enter white"></span> Login
									</button>
								</div>
							</div>
						</div>
					</div>
				</div>

			</form>
		</div>

	</div>
	<!-- End .container-fluid -->

	<!-- Validacion de Campos
    ================================================== -->
	<script type="text/javascript"
		src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
	<script type="text/javascript" src="js/bootstrap/bootstrap.js"></script>
	<script type="text/javascript"
		src="plugins/touch-punch/jquery.ui.touch-punch.min.js"></script>
	<script type="text/javascript"
		src="plugins/ios-fix/ios-orientationchange-fix.js"></script>
	<script type="text/javascript"
		src="plugins/validate/jquery.validate.min.js"></script>
	<script type="text/javascript"
		src="plugins/uniform/jquery.uniform.min.js"></script>

	<script type="text/javascript">
        // document ready function
        $(document).ready(function() {
            $("input, textarea, select").not('.nostyle').uniform();
            $("#loginForm").validate({
                rules: {
                    username: {
                        required: true,
                        email: true
                    },
                    password: {
                        required: true,
                        minlength: 6
                 
                    }  
                },
                messages: {
                    username: {
                        required: "Campo requerido",
						email:"El campo email esta mal formado"
                    },
                    password: {
                        required: "Campo requerido",
                        minlength: "El password debe tener 6 o mas caracteres"
                    }
                }   
            });
        });
    </script>


</body>
</html>
